<template>
  <div>
    <el-card>
      <div class="control-box">
        <el-button
          :disabled="showShopBtn"
          class="add-shop"
          @click="addShopItem()"
          type="primary"
          >新 增</el-button
        >
        <el-dialog
          title="检查记录"
          :visible.sync="calendarVisible"
          class="calendar"
          width="1391px"
          top="50px"
          center
          :destroy-on-close="true"
          @close="closeCalendarDialog"
        >
          <el-calendar :key="componentKey" v-model="calendar_value">
            <template slot="dateCell" slot-scope="{ data }">
              <template v-if="Object.keys(check_arr).indexOf(data.day) > -1">
                <p class="is-checked" @click="detail(data.day)">
                  {{ data.day.split("-").slice(2)[0] }}
                </p>
              </template>
              <template v-else-if="data.day < getCurrentDateTime()">
                <p @click="detail(data.day)">
                  {{ data.day.split("-").slice(2)[0] }}
                </p>
              </template>
              <template v-else-if="data.day == getCurrentDateTime()">
                <p @click="detail(data.day)">
                  {{ data.day.split("-").slice(2)[0] }}
                </p>
              </template>
              <template v-else-if="data.day > getCurrentDateTime()">
                <p>{{ data.day.split("-").slice(2)[0] }}</p>
              </template>
            </template>
          </el-calendar>
          <el-form
            ref="calendar_form"
            :model="check_form"
            :rules="checkForm"
            label-position="left"
            label-width="110px"
          >
            <el-form-item
              ref="examine_date_record"
              label="检查时间:"
              prop="examine_date_record"
            >
              <el-date-picker
                v-model="check_form.examine_date_record"
                type="date"
                placeholder="检查时间"
                value-format="yyyy-MM-dd"
                :picker-options="pickerOptions"
              >
              </el-date-picker>
              <!-- <el-input type="date" placeholder="检查时间" v-model="add_newShop.shopid" autocomplete="off"></el-input> -->
            </el-form-item>
            <el-form-item
              ref="examine_person"
              label="检查人员:"
              prop="examine_person"
            >
              <el-input
                placeholder="检查人员"
                v-model="check_form.examine_person"
                autocomplete="off"
              ></el-input>
            </el-form-item>
            <el-form-item
              ref="examine_detail"
              label="检查详情:"
              prop="examine_detail"
            >
              <el-input
                type="textarea"
                class="textarea"
                placeholder="检查详情"
                v-model="check_form.examine_detail"
                autocomplete="off"
              ></el-input>
            </el-form-item>
            <el-form-item>
              <el-button v-if="showSubmitBtn" type="primary" @click="onSubmit"
                >保存</el-button
              >
              <el-button
                type="danger"
                v-if="showSubmitBtnDelete"
                @click="onDelete"
                >删除</el-button
              >
              <el-button v-if="showSubmitBtnCancel" @click="onCancel"
                >取消</el-button
              >
            </el-form-item>
          </el-form>
        </el-dialog>
        <el-dialog
          title="隐患店招信息"
          class="add-form"
          width="672px"
          top="152px"
          :visible.sync="dialogFormVisible"
          center
          @close="closeDialogFormVisible"
        >
          <el-form
            ref="form"
            :model="add_newShop"
            :rules="addForm"
            :label-position="labelPosition"
            label-width="200px"
          >
            <el-form-item ref="number" label="编号:" prop="number">
              <el-input
                placeholder="编号"
                v-model="add_newShop.number"
                autocomplete="off"
              ></el-input>
            </el-form-item>
            <el-form-item
              ref="rectify_number"
              label="整改编号:"
              prop="rectify_number"
            >
              <el-input
                placeholder="整改编号"
                v-model="add_newShop.rectify_number"
                autocomplete="off"
              ></el-input>
            </el-form-item>
            <el-form-item
              ref="upload_img_before"
              class="upload-form-item"
              label="整改前:"
              prop="upload_img_before"
            >
              <el-upload
                ref="picture_card_before"
                :class="{ hide: showBtnDealImg, inline: true }"
                :on-change="dealImgChange"
                :on-preview="handlePictureCardPreview"
                :on-remove="handleDealImgRemove"
                :auto-upload="uploadAction"
                accept=".jpeg,.jpg,.gif,.png"
                :file-list="dealFileList"
                :limit="1"
                action=""
                list-type="picture-card"
              >
                <i slot="default" class="el-icon-plus"></i>
              </el-upload>
              <el-dialog
                custom-class="dialogImage"
                :modal="false"
                :visible.sync="dialogVisible"
              >
                <img width="100%" :src="dialogImageUrl" alt="" />
              </el-dialog>
            </el-form-item>
            <el-form-item
              ref="upload_img_after"
              label="整改后:"
              class="upload-form-item"
              prop="upload_img_after"
            >
              <el-upload
                ref="picture_card_after"
                :class="{ hide2: showBtnDealImg2, inline: true }"
                :on-change="dealImgChange2"
                :on-preview="handlePictureCardPreview2"
                :on-remove="handleDealImgRemove2"
                :auto-upload="uploadAction"
                accept=".jpeg,.jpg,.gif,.png"
                :limit="1"
                :file-list="dealFileList2"
                action=""
                list-type="picture-card"
              >
                <i slot="default" class="el-icon-plus"></i>
                <!-- <div slot="file" slot-scope="{ file }">
                  <img
                    class="el-upload-list__item-thumbnail"
                    :src="file.url"
                    alt=""
                  />
                  <span class="el-upload-list__item-actions">
                    <span
                      class="el-upload-list__item-preview"
                      @click="handlePictureCardPreview(file)"
                    >
                      <i class="el-icon-zoom-in"></i>
                    </span>
                    <span
                      v-if="!disabled"
                      class="el-upload-list__item-delete"
                      @click="handleDownload(file)"
                    >
                      <i class="el-icon-download"></i>
                    </span>
                    <span
                      class="el-upload-list__item-delete"
                      @click="handleDealImgRemove2(file, fileList)"
                    >
                      <i class="el-icon-delete"></i>
                    </span>
                  </span>
                </div> -->
              </el-upload>
              <el-dialog
                custom-class="dialogImage"
                :modal="false"
                :visible.sync="dialogVisible2"
              >
                <img width="100%" :src="dialogImageUrl2" alt="" />
              </el-dialog>
            </el-form-item>
            <el-form-item ref="address" label="被检查单位地址:" prop="address">
              <el-input
                placeholder="被检查单位地址"
                v-model="add_newShop.address"
                autocomplete="off"
              ></el-input>
            </el-form-item>
            <el-form-item ref="lng" label="经度:" prop="x">
              <el-input
                placeholder="百度地图获取的经度"
                v-model="add_newShop.x"
                autocomplete="off"
              ></el-input>
            </el-form-item>
            <el-form-item ref="lat" label="纬度:" prop="y">
              <el-input
                placeholder="百度地图获取的纬度"
                v-model="add_newShop.y"
                autocomplete="off"
              ></el-input>
            </el-form-item>
            <!-- <el-form-item>
              <div class="bm-view" id="container" v-if="showMapContainer"></div>
            </el-form-item> -->
            <el-form-item
              ref="unit_name"
              label="被检查单位名称:"
              prop="unit_name"
            >
              <el-input
                placeholder="被检查单位名称"
                v-model="add_newShop.unit_name"
                autocomplete="off"
              ></el-input>
            </el-form-item>
            <el-form-item ref="name" label="联系人:" prop="name">
              <el-input
                placeholder="联系人"
                v-model="add_newShop.name"
                autocomplete="off"
              ></el-input>
            </el-form-item>
            <el-form-item ref="phone" label="联系电话:" prop="phone">
              <el-input
                placeholder="联系电话"
                v-model="add_newShop.phone"
                autocomplete="off"
              ></el-input>
            </el-form-item>
            <el-form-item ref="status" label="经营业态:" prop="status">
              <el-input
                placeholder="经营业态"
                v-model="add_newShop.status"
                autocomplete="off"
              ></el-input>
            </el-form-item>
            <el-form-item
              ref="examine_date"
              label="检查日期:"
              prop="examine_date"
            >
              <el-date-picker
                v-model="add_newShop.examine_date"
                type="date"
                value-format="yyyy-MM-dd"
                placeholder="检查日期"
              >
              </el-date-picker>
            </el-form-item>
            <el-form-item
              ref="hidden_danger_desc"
              label="隐患问题描述:"
              prop="hidden_danger_desc"
            >
              <el-input
                placeholder="隐患问题描述"
                v-model="add_newShop.hidden_danger_desc"
                autocomplete="off"
              ></el-input>
            </el-form-item>
            <el-form-item
              ref="review_date"
              label="复查日期:"
              prop="review_date"
            >
              <el-date-picker
                v-model="add_newShop.review_date"
                type="date"
                value-format="yyyy-MM-dd"
                placeholder="复查日期"
              >
              </el-date-picker>
            </el-form-item>
            <el-form-item
              ref="review_result"
              label="处置结果:"
              prop="review_result"
            >
              <el-input
                v-model="add_newShop.review_result"
                placeholder="处置结果"
                autocomplete="off"
                :disabled="true"
              ></el-input>
              <!-- <el-select
                v-model="add_newShop.review_result"
                placeholder="处置结果"
              >
                <el-option
                  v-for="item in options"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                >
                </el-option>
              </el-select> -->
            </el-form-item>
          </el-form>
          <div slot="footer" class="dialog-footer">
            <el-button type="primary" @click="submit()" v-loading="loginLoading"
              >提 交</el-button
            >
          </div>
        </el-dialog>
        <el-dialog
          title="隐患店招信息"
          class="add-form"
          width="672px"
          top="152px"
          :visible.sync="dialogFormVisibleUpdate"
          center
          @close="closeDialogFormVisibleUpdate"
        >
          <el-form
            ref="formUpdate"
            :model="add_newShop"
            :rules="addFormUpdate"
            :label-position="labelPosition"
            label-width="200px"
          >
            <el-form-item ref="number" label="编号:" prop="number">
              <el-input
                placeholder="编号"
                v-model="add_newShop.number"
                autocomplete="off"
              ></el-input>
            </el-form-item>
            <el-form-item
              ref="rectify_number"
              label="整改编号:"
              prop="rectify_number"
            >
              <el-input
                placeholder="整改编号"
                v-model="add_newShop.rectify_number"
                autocomplete="off"
              ></el-input>
            </el-form-item>
            <el-form-item
              class="upload-form-item"
              label="整改前:"
              prop="upload_img_before"
            >
              <el-upload
                ref="picture_card_before_update"
                :class="{ hide: showBtnDealImgUpdate, inline: true }"
                :on-change="dealImgChangeUpdate"
                :on-preview="handlePictureCardPreviewUpdate"
                :on-remove="handleDealImgRemoveUpdate"
                :auto-upload="uploadAction"
                accept=".jpeg,.jpg,.gif,.png"
                :file-list="dealFileListUpdate"
                :limit="1"
                action=""
                list-type="picture-card"
              >
                <i slot="default" class="el-icon-plus"></i>
              </el-upload>
              <el-dialog
                custom-class="dialogImage"
                :modal="false"
                :visible.sync="dialogVisibleUpdate"
              >
                <img width="100%" :src="dialogImageUrlUpdate" alt="" />
              </el-dialog>
            </el-form-item>
            <el-form-item
              ref="upload_img_after"
              label="整改后:"
              class="upload-form-item"
              prop="upload_img_after"
            >
              <el-upload
                ref="picture_card_after_update"
                :class="{ hide2: showBtnDealImgUpdate2, inline: true }"
                :on-change="dealImgChangeUpdate2"
                :on-preview="handlePictureCardPreviewUpdate2"
                :on-remove="handleDealImgRemoveUpdate2"
                :auto-upload="uploadAction"
                accept=".jpeg,.jpg,.gif,.png"
                :limit="1"
                :file-list="dealFileListUpdate2"
                action=""
                list-type="picture-card"
              >
                <i slot="default" class="el-icon-plus"></i>
                <!-- <div slot="file" slot-scope="{ file }">
                  <img
                    class="el-upload-list__item-thumbnail"
                    :src="file.url"
                    alt=""
                  />
                  <span class="el-upload-list__item-actions">
                    <span
                      class="el-upload-list__item-preview"
                      @click="handlePictureCardPreview(file)"
                    >
                      <i class="el-icon-zoom-in"></i>
                    </span>
                    <span
                      v-if="!disabled"
                      class="el-upload-list__item-delete"
                      @click="handleDownload(file)"
                    >
                      <i class="el-icon-download"></i>
                    </span>
                    <span
                      class="el-upload-list__item-delete"
                      @click="handleDealImgRemove2(file, fileList)"
                    >
                      <i class="el-icon-delete"></i>
                    </span>
                  </span>
                </div> -->
              </el-upload>
              <el-dialog
                custom-class="dialogImage"
                :modal="false"
                :visible.sync="dialogVisibleUpdate2"
              >
                <img width="100%" :src="dialogImageUrlUpdate2" alt="" />
              </el-dialog>
            </el-form-item>
            <el-form-item ref="address" label="被检查单位地址:" prop="address">
              <el-input
                placeholder="被检查单位地址"
                v-model="add_newShop.address"
                autocomplete="off"
              ></el-input>
            </el-form-item>
            <el-form-item ref="lng" label="经度:" prop="x">
              <el-input
                placeholder="百度地图获取的经度"
                v-model="add_newShop.x"
                autocomplete="off"
              ></el-input>
            </el-form-item>
            <el-form-item ref="lat" label="纬度:" prop="y">
              <el-input
                placeholder="百度地图获取的纬度"
                v-model="add_newShop.y"
                autocomplete="off"
              ></el-input>
            </el-form-item>
            <!-- <el-form-item>
              <div
                class="bm-view"
                id="updateContainer"
                v-if="showMapUpdateContainer"
              ></div>
            </el-form-item> -->
            <el-form-item
              ref="unit_name"
              label="被检查单位名称:"
              prop="unit_name"
            >
              <el-input
                placeholder="被检查单位名称"
                v-model="add_newShop.unit_name"
                autocomplete="off"
              ></el-input>
            </el-form-item>
            <el-form-item ref="name" label="联系人:" prop="name">
              <el-input
                placeholder="联系人"
                v-model="add_newShop.name"
                autocomplete="off"
              ></el-input>
            </el-form-item>
            <el-form-item ref="phone" label="联系电话:" prop="phone">
              <el-input
                placeholder="联系电话"
                v-model="add_newShop.phone"
                autocomplete="off"
              ></el-input>
            </el-form-item>
            <el-form-item ref="status" label="经营业态:" prop="status">
              <el-input
                placeholder="经营业态"
                v-model="add_newShop.status"
                autocomplete="off"
              ></el-input>
            </el-form-item>
            <el-form-item
              ref="examine_date"
              label="检查日期:"
              prop="examine_date"
            >
              <el-date-picker
                v-model="add_newShop.examine_date"
                type="date"
                value-format="yyyy-MM-dd"
                placeholder="检查日期"
              >
              </el-date-picker>
            </el-form-item>
            <el-form-item
              ref="hidden_danger_desc"
              label="隐患问题描述:"
              prop="hidden_danger_desc"
            >
              <el-input
                placeholder="隐患问题描述"
                v-model="add_newShop.hidden_danger_desc"
                autocomplete="off"
              ></el-input>
            </el-form-item>
            <el-form-item
              ref="review_date"
              label="复查日期:"
              prop="review_date"
            >
              <el-date-picker
                v-model="add_newShop.review_date"
                type="date"
                value-format="yyyy-MM-dd"
                placeholder="复查日期"
              >
              </el-date-picker>
            </el-form-item>
            <el-form-item
              ref="review_result"
              label="处置结果:"
              prop="review_result"
            >
              <el-input
                v-model="add_newShop.review_result"
                placeholder="处置结果"
                autocomplete="off"
                :disabled="true"
              ></el-input>
              <!-- <el-select
                v-model="add_newShop.review_result"
                placeholder="处置结果"
              >
                <el-option
                  v-for="item in options"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                >
                </el-option>
              </el-select> -->
            </el-form-item>
          </el-form>
          <div slot="footer" class="dialog-footer">
            <el-button
              type="primary"
              @click="update()"
              v-loading="updateLoginLoading"
              >提 交</el-button
            >
          </div>
        </el-dialog>
        <el-input
          v-model="sousuo"
          placeholder="请输入编号/被检查单位地址"
          prefix-icon="el-icon-search"
          style="width:320px;float: right;"
          @keyup.enter.native="searchEnterFun"
        >
        </el-input>
      </div>

      <el-table
        class="shop_list_table"
        highlight-current-row
        :cell-style="{
          textAlign: 'center',
          fontSize: '16px',
          fontFamily: 'Microsoft YaHei',
          fontWeight: '400',
          color: '#494949',
          padding: '2px 0'
        }"
        :header-cell-style="{
          textAlign: 'center',
          fontSize: '16px',
          fontWeight: 'bold',
          fontFamily: 'Microsoft YaHei',
          color: '#494949',
          background: '#F2F6FF',
          padding: '4px 0'
        }"
        :data="shopTable"
      >
        <el-table-column
          type="index"
          label="序号"
          width="60"
          show-overflow-tooltip
        >
          <template scope="scope">
            <span>{{ (currentPage - 1) * pageSize + scope.$index + 1 }}</span>
          </template>
        </el-table-column>
        <el-table-column
          prop="number"
          label="编号"
          show-overflow-tooltip
          width="130"
        >
        </el-table-column>
        <el-table-column
          prop="rectify_number"
          label="整改编号"
          show-overflow-tooltip
          width="130"
        >
        </el-table-column>
        <el-table-column
          prop="address"
          label="被检查单位地址"
          show-overflow-tooltip
        >
        </el-table-column>
        <el-table-column
          prop="unit_name"
          label="被检查单位名称"
          show-overflow-tooltip
        >
        </el-table-column>
        <el-table-column
          prop="name"
          label="联系人"
          show-overflow-tooltip
          width="80"
        >
        </el-table-column>
        <el-table-column
          prop="phone"
          label="联系电话"
          show-overflow-tooltip
          width="140"
        >
        </el-table-column>
        <el-table-column prop="status" label="经营业态" show-overflow-tooltip>
        </el-table-column>
        <el-table-column
          prop="examine_date"
          label="检查日期"
          show-overflow-tooltip
          width="120"
        >
        </el-table-column>
        <el-table-column
          prop="hidden_danger_desc"
          label="隐患问题描述"
          show-overflow-tooltip
        >
        </el-table-column>
        <el-table-column
          prop="review_date"
          label="复查时间"
          show-overflow-tooltip
          width="120"
        >
        </el-table-column>
        <el-table-column
          prop="review_result"
          label="处理结果"
          show-overflow-tooltip
          width="90"
        >
          <template slot-scope="scope">
            <template v-if="scope.row.review_result === '处置中'">
              <el-button
                :disabled="showShopBtn"
                type="text"
                @click="calendar(scope.row)"
                >{{ scope.row.review_result }}</el-button
              >
            </template>
            <template v-else>
              <span>{{ scope.row.review_result }}</span>
            </template>
          </template>
        </el-table-column>
        <el-table-column prop="roomId" label="操作" width="100">
          <template slot-scope="scope">
            <el-button
              :disabled="showShopBtn"
              type="text"
              @click="modify(scope.row)"
              >修改</el-button
            >
            <el-button
              :disabled="showShopBtn"
              type="text"
              @click="delet(scope.row)"
              >删除</el-button
            >
          </template>
        </el-table-column>
      </el-table>
      <el-pagination
        background
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        @prev-click="prevClick"
        @next-click="nextClick"
        :current-page.sync="currentPage"
        :page-size="pageSize"
        layout="prev, pager, next, jumper"
        :total="total"
      >
      </el-pagination>
    </el-card>
  </div>
</template>

<script>
import {
  canvasDataURL,
  convertBase64UrlToBlob
} from "../utils/canvasBase64.js";
//image-upload
export default {
  data() {
    let validateFileUrl = (rule, value, callback) => {
      if (this.$refs.picture_card_before.$children[0].files.length === 0) {
        callback(new Error("请选择图片"));
      } else {
        callback();
      }
    };
    let validateFileUrl2 = (rule, value, callback) => {
      if (this.add_newShop.rectify_number) {
        if (this.$refs.picture_card_after.$children[0].files.length === 0) {
          callback(new Error("请选择图片"));
        } else {
          callback();
        }
      } else {
        callback();
      }
    };
    let validateFileUrlUpdate = (rule, value, callback) => {
      if (
        this.$refs.picture_card_before_update.$children[0].files.length === 0
      ) {
        callback(new Error("请选择图片"));
      } else {
        callback();
      }
    };
    let validateFileUrlUpdate2 = (rule, value, callback) => {
      if (this.add_newShop.rectify_number) {
        if (
          this.$refs.picture_card_after_update.$children[0].files.length === 0
        ) {
          callback(new Error("请选择图片"));
        } else {
          callback();
        }
      } else {
        callback();
      }
    };
    // let validPhone = (rule, value,callback)=>{
    //   const reg = /^1[3|4|5|6|7|8|9][0-9]\d{8}$/
    //   if(value){
    //     if (!reg.test(value)){
    //       callback(new Error('请填写正确的11位手机号码'))
    //     }else{
    //       callback()
    //     }
    //   }else{
    //     callback()
    //   }
    // }
    return {
      componentKey: 0,
      map: null,
      geoc: null,
      showMapContainer: false,
      showMapUpdateContainer: false,
      options: [
        //{value: "处置中",label: "处置中"}
      ],
      pickerOptions: {
        disabledDate(time) {
          return time.getTime() > Date.now();
        }
      },
      showSubmitBtn: true,
      showSubmitBtnDelete: false,
      showSubmitBtnCancel: true,
      showShopBtn: false,

      loginLoading: false,
      updateLoginLoading: false,
      uploadAction: false,
      add_newShop: {
        number: "",
        rectify_number: "",
        address: "",
        x: "",
        y: "",
        unit_name: "",
        name: "",
        phone: "",
        status: "",
        examine_date: "",
        hidden_danger_desc: "",
        review_date: "",
        review_result: "处置中"
      },
      labelPosition: "right",
      showBtnDealImg: false,
      showBtnDealImg2: false,
      showBtnDealImgUpdate: false,
      showBtnDealImgUpdate2: false,
      dealFileList: [],
      dealFileList2: [],
      dealFileListUpdate: [],
      dealFileListUpdate2: [],
      limitCountImg: 1,
      addForm: {
        number: [{ required: true, message: "请填写编号", trigger: "blur" }],
        rectify_number: [{ required: false, trigger: "blur" }],
        upload_img_before: [
          { required: true, validator: validateFileUrl, trigger: "change" }
        ],
        upload_img_after: [
          { required: false, validator: validateFileUrl2, trigger: "change" }
        ],
        upload_img_before_update: [
          {
            required: true,
            validator: validateFileUrlUpdate,
            trigger: "change"
          }
        ],
        upload_img_after_update: [
          {
            required: false,
            validator: validateFileUrlUpdate2,
            trigger: "change"
          }
        ],
        address: [
          { required: true, message: "请填写被检查单位地址", trigger: "blur" }
        ],
        x: [{ required: true, message: "请填写经度", trigger: "blur" }],
        y: [{ required: true, message: "请填写纬度", trigger: "blur" }],
        unit_name: [
          { required: true, message: "请填写被检查单位名称", trigger: "blur" }
        ],
        name: [{ required: false, message: "请填写联系人", trigger: "blur" }],
        //phone: [{validator: validPhone, required: false, trigger: "blur" }],
        status: [
          { required: false, message: "请填写经营业态", trigger: "blur" }
        ],
        examine_date: [
          { required: true, message: "请选择检查日期", trigger: "blur" }
        ],
        hidden_danger_desc: [
          { required: false, message: "请填写描述", trigger: "blur" }
        ],
        review_date: [
          { required: true, message: "请选择复查日期", trigger: "blur" }
        ],
        review_result: [
          { required: true, message: "请选择处置结果", trigger: "blur" }
        ]
      },
      addFormUpdate: {
        number: [{ required: true, message: "请填写编号", trigger: "blur" }],
        rectify_number: [{ required: false, trigger: "blur" }],
        upload_img_before_update: [
          {
            required: true,
            validator: validateFileUrlUpdate,
            trigger: "change"
          }
        ],
        upload_img_after_update: [
          {
            required: false,
            validator: validateFileUrlUpdate2,
            trigger: "change"
          }
        ],
        address: [
          { required: true, message: "请填写被检查单位地址", trigger: "blur" }
        ],
        x: [{ required: true, message: "请填写经度", trigger: "blur" }],
        y: [{ required: true, message: "请填写纬度", trigger: "blur" }],
        unit_name: [
          { required: true, message: "请填写被检查单位名称", trigger: "blur" }
        ],
        name: [{ required: false, message: "请填写联系人", trigger: "blur" }],
        //phone: [{validator: validPhone, required: false, trigger: "blur" }],
        status: [
          { required: false, message: "请填写经营业态", trigger: "blur" }
        ],
        examine_date: [
          { required: true, message: "请选择检查日期", trigger: "blur" }
        ],
        hidden_danger_desc: [
          { required: false, message: "请填写描述", trigger: "blur" }
        ],
        review_date: [
          { required: true, message: "请选择复查日期", trigger: "blur" }
        ],
        review_result: [
          { required: true, message: "请选择处置结果", trigger: "blur" }
        ]
      },
      error_number: "",
      examine_date_record: "",
      check_form: {
        id: "",
        examine_date_record: "",
        examine_person: "",
        examine_detail: ""
      },
      // check_arr: {
      //   "2020-10-20": {
      //     examine_date: "2020-10-23",
      //     check_person: "444",
      //     check_record: "咳咳"
      //   }
      // },
      check_arr: {},
      checkForm: {
        examine_date_record: [
          { required: true, message: "请填写检查日期", trigger: "blur" }
        ],
        examine_person: [
          { required: true, message: "请填写检察人员", trigger: "blur" }
        ],
        examine_detail: [
          { required: true, message: "请填写检查记录", trigger: "blur" }
        ]
      },
      shopTable: [],
      shopTable1: [],
      sousuo: "",
      dialogImageUrl: "",
      dialogVisible: false,
      dialogImageUrl2: "",
      dialogVisible2: false,
      dialogImageUrlUpdate: "",
      dialogVisibleUpdate: false,
      dialogImageUrlUpdate2: "",
      dialogVisibleUpdate2: false,
      calendarVisible: false,
      dialogFormVisible: false,
      dialogFormVisibleUpdate: false,
      calendar_value: "",
      total: 1,
      currentPage: 1,
      pageSize: 18
    };
  },
  created() {
    this.orderList(this.currentPage);
    // this.sessionData();
    // localStorage.removeItem("jianchaData");
  },
  mounted() {
    this.$nextTick(() => {
      let qx = this.$store.getters.getUser.user_qx;
      if (qx === "超级管理员") {
        this.showShopBtn = false;
      } else if (qx === "管理员") {
        this.showShopBtn = false;
      } else if (qx === "编辑者") {
        this.showShopBtn = false;
      } else if (qx === "查看者") {
        this.showShopBtn = true;
      }
    });
  },
  watch: {
    "add_newShop.rectify_number": function(val, oldVal) {
      if (val) {
        this.add_newShop.review_result = "已整改";
        //this.options = [{value: "已整改",label: "已整改"}]
      } else {
        this.add_newShop.review_result = "处置中";
        //this.options = [{value: "处置中",label: "处置中"}]
      }
    },
    "check_form.examine_date_record": function(val, oldVal) {
      this.calendar_value = val;
      let currentDateTime = this.getCurrentDateTime();
      if (Object.keys(this.check_arr).indexOf(val) > -1) {
        //有记录
        let formData = this.check_arr[val];
        if (currentDateTime === val) {
          //选中今天
          this.showSubmitBtn = true;
          this.showSubmitBtnDelete = true;
          if (formData) {
            this.check_form = Object.assign({}, formData);
            this.flag = true;
          } else {
            this.flag = false;
          }
        } else {
          //选中非今天
          this.showSubmitBtn = false;
          this.showSubmitBtnDelete = true;
          this.check_form = Object.assign({}, formData);
        }
      } else {
        //没有记录
        this.$refs.calendar_form.resetFields();
        for (let key in this.check_form) {
          this.check_form[key] = "";
        }
        this.check_form["examine_date_record"] = val;
        this.flag = false;
        this.showSubmitBtn = true;
        this.showSubmitBtnDelete = false;

        console.log("watch");

        // let currentDateTime = this.getCurrentDateTime();
        // if(currentDateTime === date){
        //   this.flag = false;
        //   this.showSubmitBtn = true;
        // }else{
        //   this.flag = false;
        //   this.showSubmitBtn = false;
        // }
      }
    }
    // sousuo(curVal) {
    //   this.loading = true;
    //   // 实现input连续输入，只发一次请求
    //   clearTimeout(this.timeout);
    //   this.timeout = setTimeout(() => {
    //     this.sousuoList(curVal);
    //   }, 2000);
    // }
  },
  methods: {
    forceRerender() {
      this.componentKey += 1;
    },
    handlePictureCardPreview(file) {
      this.dialogImageUrl = file.url;
      this.dialogVisible = true;
    },
    handlePictureCardPreview2(file) {
      this.dialogImageUrl2 = file.url;
      this.dialogVisible2 = true;
    },
    handlePictureCardPreviewUpdate(file) {
      this.dialogImageUrlUpdate = file.url;
      this.dialogVisibleUpdate = true;
    },
    handlePictureCardPreviewUpdate2(file) {
      this.dialogImageUrlUpdate2 = file.url;
      this.dialogVisibleUpdate2 = true;
    },
    searchEnterFun(e) {
      var keyCode = window.event ? e.keyCode : e.which;
      if (keyCode == 13) {
        let s = this.sousuo;
        this.shopTable = [];
        this.$request({
          url: "/rf/getSysSignageErrorListByType",
          method: "get",
          params: { address: s, page: 1 }
          //headers:{'Content-Type':'application/x-www-form-urlencoded; charset=UTF-8'}
        })
          .then(response => {
            if (response.error_code == 0) {
              this.currentPage = 1;
              this.shopTable = response.data;
              this.total = response.count;
            } else {
              this.$message({ message: response.error_msg, type: "info" });
            }
          })
          .catch(error => {
            this.$message({
              message: "搜索失败，网络异常",
              type: "info",
              duration: 2000
            });
          });
      }
    },
    getSousuoType() {
      let s = this.sousuo;
      if (s === "") {
        s = 2;
      } else if (
        s.indexOf("已") != -1 ||
        s.indexOf("整") != -1 ||
        s.indexOf("改") != -1 ||
        s.indexOf("已整") != -1 ||
        s.indexOf("已整改") != -1
      ) {
        s = 0;
      } else if (
        s.indexOf("处") != -1 ||
        s.indexOf("置") != -1 ||
        s.indexOf("中") != -1 ||
        s.indexOf("处置") != -1 ||
        s.indexOf("处置中") != -1
      ) {
        s = 1;
      }
      return s;
    },
    addShopItem() {
      this.showMapContainer = true;
      this.dialogFormVisible = true;
      this.$nextTick(() => {
        this.$refs.form.resetFields();
        this.showBtnDealImg =
          this.$refs.picture_card_before.$children[0].files.length >=
          this.limitCountImg;
        this.showBtnDealImg2 =
          this.$refs.picture_card_after.$children[0].files.length >=
          this.limitCountImg;

        // this.$refs.change_number.resetField();
        // this.$refs.upload_img.resetField();
        // this.$refs.address.resetField();
        // this.$refs.unit_name.resetField();
        // this.$refs.name.resetField();
        // this.$refs.phone.resetField();
        // this.$refs.status.resetField();
        // this.$refs.examine_date.resetField();
        // this.$refs.hidden_danger_desc.resetField();
        // this.$refs.review_date.resetField();
        // this.$refs.review_result.resetField();
      });
    },
    closeDialogFormVisible() {
      this.dialogFormVisible = false;
      this.showMapContainer = false;
      this.loginLoading = false;
      this.dealFileList = [];
      this.dealFileList2 = [];
      this.$nextTick(() => {
        this.$refs.form.resetFields();
      });
    },
    closeDialogFormVisibleUpdate() {
      this.dialogFormVisibleUpdate = false;
      this.showMapUpdateContainer = false;
      this.updateLoginLoading = false;
      this.dealFileListUpdate = [];
      this.dealFileListUpdate2 = [];
      this.$nextTick(() => {
        this.$refs.formUpdate.resetFields();
      });
    },
    dealImgChange(file, fileList) {
      console.log(file, fileList.length);
      this.showBtnDealImg = fileList.length >= this.limitCountImg;
    },
    handleDealImgRemove(file, fileList) {
      let length = fileList.length;
      this.showBtnDealImg = length >= this.limitCountImg;
    },
    dealImgChange2(file, fileList) {
      this.showBtnDealImg2 = fileList.length >= this.limitCountImg;
    },
    handleDealImgRemove2(file, fileList) {
      this.showBtnDealImg2 = fileList.length >= this.limitCountImg;
    },
    dealImgChangeUpdate(file, fileList) {
      this.showBtnDealImgUpdate = fileList.length >= this.limitCountImg;
    },
    handleDealImgRemoveUpdate(file, fileList) {
      this.showBtnDealImgUpdate = fileList.length >= this.limitCountImg;
    },
    dealImgChangeUpdate2(file, fileList) {
      this.showBtnDealImgUpdate2 = fileList.length >= this.limitCountImg;
    },
    handleDealImgRemoveUpdate2(file, fileList) {
      this.showBtnDealImgUpdate2 = fileList.length >= this.limitCountImg;
    },
    closeCalendarDialog() {
      this.$refs.calendar_form.resetFields();
      this.showSubmitBtn = true;
      this.showSubmitBtnDelete = false;
      this.calendar_value = this.getCurrentDateTime();
      for (let key in this.check_form) {
        this.check_form[key] = "";
      }
      for (let key in this.check_arr) {
        delete this.check_arr[key];
      }
    },
    calendar(v) {
      this.error_number = v.number;
      this.$request({
        url: "/rf/getExamineRecord",
        method: "get",
        params: { error_number: v.number }
      })
        .then(response => {
          if (response.error_code == 0) {
            //console.log('first',this.check_arr)
            let check_temp = {};
            response.data.forEach(val => {
              let nDate = this.getDateTime(val.examine_date);
              let obj = {
                id: val.id,
                examine_date_record: nDate,
                examine_person: val.examine_person,
                examine_detail: val.examine_detail
              };
              check_temp[nDate] = obj;
            });
            this.check_arr = Object.assign({}, check_temp);
            this.calendar_value = this.getCurrentDateTime();
            if (this.check_arr[this.calendar_value]) {
              this.check_form.id = this.check_arr[this.calendar_value].id;
            }

            let currentDateTime = this.getCurrentDateTime();
            if (Object.keys(this.check_arr).indexOf(this.calendar_value) > -1) {
              //有数据
              if (currentDateTime === this.calendar_value) {
                this.showSubmitBtn = true;
                this.showSubmitBtnDelete = true;
              } else {
                this.showSubmitBtn = false;
                this.showSubmitBtnDelete = true;
              }
            } else {
              //无数据
              this.showSubmitBtn = true;
              this.showSubmitBtnDelete = false;
            }
            let formData = this.check_arr[this.calendar_value];
            if (formData) {
              this.flag = true; //代表修改
              this.check_form = Object.assign({}, formData);
            } else {
              this.flag = false; //代表新增
              // for(let key in this.check_form){
              //   this.check_form[key] = "";
              // }
            }
            //console.log('second',this.check_arr)
            this.calendarVisible = true;
          } else {
            this.$message({ message: response.error_msg, type: "info" });
          }
        })
        .catch(error => {
          console.log(error);
          this.$message({
            message: "信息查询失败，网络异常",
            type: "info",
            duration: 2000
          });
        });
    },
    onSubmit() {
      this.$refs.calendar_form.validate(async valid => {
        if (valid) {
          let {
            examine_date_record,
            examine_person,
            examine_detail
          } = this.check_form;
          let error_number = this.error_number;
          let flag;
          let date2 = this.getDateTime(this.calendar_value);
          let currentDateTime = this.getCurrentDateTime();
          if (Object.keys(this.check_arr).indexOf(date2) > -1) {
            //有数据
            if (currentDateTime === date2) {
              flag = true;
            }
          } else {
            //无数据
            flag = false;
          }
          this.$request({
            url: "/rf/updateExamineRecord",
            method: "post",
            data: {
              examine_date: examine_date_record,
              examine_person: examine_person,
              examine_detail: examine_detail,
              error_number: error_number,
              flag: flag
            }
          })
            .then(response => {
              if (response.error_code == 0) {
                this.$message({ type: "success", message: "提交成功" });
                // this.closeCalendarDialog();
                // this.calendarVisible = false;
                this.getCalendar(this.error_number, this.calendar_value);
              } else {
                this.$message({ message: response.error_msg, type: "info" });
              }
            })
            .catch(error => {
              this.$message({
                message: "提交失败，网络异常",
                type: "info",
                duration: 2000
              });
            });
        }
      });
    },
    getCalendar(number, date) {
      this.$request({
        url: "/rf/getExamineRecord",
        method: "get",
        params: { error_number: number }
      })
        .then(response => {
          if (response.error_code == 0) {
            for (let key in this.check_arr) {
              delete this.check_arr[key];
            }
            response.data.forEach(val => {
              let nDate = this.getDateTime(val.examine_date);
              this.check_arr[nDate] = {
                id: val.id,
                examine_date_record: nDate,
                examine_person: val.examine_person,
                examine_detail: val.examine_detail
              };
            });
            //更新日期
            //this.componentKey = 0;
            this.forceRerender();
            let date2 = this.getDateTime(date);

            console.log(date2);
            console.log(this.check_arr);
            console.log(this.check_arr[date2]);
            if (this.check_arr[date2]) {
              this.check_form.id = this.check_arr[date2].id;
            }
            //今天显示按钮
            let currentDateTime = this.getCurrentDateTime();
            if (Object.keys(this.check_arr).indexOf(date2) > -1) {
              //有数据
              if (currentDateTime === date2) {
                this.showSubmitBtn = true;
                this.showSubmitBtnDelete = true;
              } else {
                this.showSubmitBtn = false;
                this.showSubmitBtnDelete = true;
              }
            } else {
              //无数据
              this.showSubmitBtn = true;
              this.showSubmitBtnDelete = false;
            }
          } else {
            this.$message({ message: response.error_msg, type: "info" });
          }
        })
        .catch(error => {
          this.$message({
            message: "信息查询失败，网络异常",
            type: "info",
            duration: 2000
          });
        });
    },
    onDelete() {
      let id = this.check_form.id;
      console.log("delete", id);
      this.$request({
        url: "/rf/deleteExamineRecord",
        method: "post",
        data: {
          id: id
        }
      })
        .then(response => {
          if (response.error_code == 0) {
            this.$message({ type: "success", message: "删除成功" });
            // this.closeCalendarDialog();
            // this.calendarVisible = false;
            this.$refs.calendar_form.resetFields();
            for (let key in this.check_form) {
              this.check_form[key] = "";
            }
            this.getCalendar(this.error_number, this.calendar_value);
          } else {
            this.$message({ message: response.error_msg, type: "info" });
          }
        })
        .catch(error => {
          this.$message({
            message: "提交失败，网络异常",
            type: "info",
            duration: 2000
          });
        });
    },
    onCancel() {
      this.calendarVisible = false;
      this.closeCalendarDialog();
    },
    detail(date) {
      console.log(date);
      this.calendar_value = date;
      console.log(this.calendar_value);
      if (Object.keys(this.check_arr).indexOf(date) > -1) {
        //有数据
        this.$refs.calendar_form.resetFields();
        let formData = this.check_arr[date];
        console.log(formData);
        let currentDateTime = this.getCurrentDateTime();
        if (formData) {
          this.flag = true; //代表修改
          this.check_form = Object.assign({}, formData);
        } else {
          this.flag = false; //代表新增
        }

        if (currentDateTime === date) {
          this.showSubmitBtn = true;
          this.showSubmitBtnDelete = true;
          this.showSubmitBtnCancel = true;
        } else {
          this.showSubmitBtn = false;
          this.showSubmitBtnDelete = true;
          this.showSubmitBtnCancel = true;
        }
      } else {
        //无数据
        this.$refs.calendar_form.resetFields();
        for (let key in this.check_form) {
          this.check_form[key] = "";
        }
        this.check_form["examine_date_record"] = date;
        this.flag = false;
        this.showSubmitBtn = true;
        this.showSubmitBtnDelete = false;
        this.showSubmitBtnCancel = true;
        console.log("无数据");
        console.log(this.check_form);
        // let currentDateTime = this.getCurrentDateTime();
        // if(currentDateTime === date){
        //   this.flag = false;
        //   this.showSubmitBtn = true;
        // }else{
        //   this.flag = false;
        //   this.showSubmitBtn = false;
        // }
      }
    },
    getDateTime(date) {
      let d = new Date(date);
      let _year = d.getFullYear();
      let _month = d.getMonth() + 1;
      if (_month < 10) {
        _month = "0" + _month;
      }
      let _day = parseInt(d.getDate());
      if (_day < 10) {
        _day = "0" + _day;
      }
      let newDate = _year + "-" + _month + "-" + _day;
      return newDate;
    },
    getCurrentDateTime() {
      let d = new Date();
      let _year = d.getFullYear();
      let _month = d.getMonth() + 1;
      if (_month < 10) {
        _month = "0" + _month;
      }
      let _day = parseInt(d.getDate());
      if (_day < 10) {
        _day = "0" + _day;
      }
      let newDate = _year + "-" + _month + "-" + _day;
      return newDate;
    },
    handleSizeChange(val) {
      console.log(`每页 ${val} 条`);
    },
    handleCurrentChange(val) {
      this.orderList(val);
    },
    prevClick(val) {
      this.orderList(val);
    },
    nextClick(val) {
      this.orderList(val);
    },
    submit() {
      this.$refs.form.validate(async valid => {
        if (valid) {
          this.loginLoading = true;
          let formdata = new FormData();
          let {
            number,
            rectify_number,
            address,
            x,
            y,
            unit_name,
            name,
            phone,
            status,
            examine_date,
            hidden_danger_desc,
            review_date,
            review_result
          } = this.add_newShop;
          formdata.append("number", number);
          formdata.append("rectify_number", rectify_number);
          formdata.append("address", address);
          formdata.append("x", x);
          formdata.append("y", y);
          formdata.append("unit_name", unit_name);
          formdata.append("name", name);
          formdata.append("phone", phone);
          formdata.append("status", status);
          formdata.append("examine_date", examine_date);
          formdata.append("hidden_danger_desc", hidden_danger_desc);
          formdata.append("review_date", review_date);
          formdata.append("review_result", review_result);

          let promise1 = new Promise((resolve, reject) => {
            if (
              this.$refs.picture_card_before.$children[0].files[0] &&
              this.$refs.picture_card_before.$children[0].files[0].raw
            ) {
              formdata.append(
                "image",
                this.$refs.picture_card_before.$children[0].files[0].raw
              );
              if (
                this.$refs.picture_card_before.$children[0].files[0].size /
                  1024 >
                1025
              ) {
                this.photoCompress(
                  this.$refs.picture_card_before.$children[0].files[0].raw,
                  { quality: 0.2 },
                  base64Codes => {
                    let _blob = convertBase64UrlToBlob(base64Codes);
                    formdata.append("image_simple", _blob);
                    resolve(formdata);
                  }
                );
              } else {
                formdata.append(
                  "image_simple",
                  this.$refs.picture_card_before.$children[0].files[0].raw
                );
                resolve(formdata);
              }
            } else {
              resolve(formdata);
            }
          });

          let promise2 = new Promise((resolve, reject) => {
            if (
              this.$refs.picture_card_after.$children[0].files[0] &&
              this.$refs.picture_card_after.$children[0].files[0].raw
            ) {
              formdata.append(
                "recruit",
                this.$refs.picture_card_after.$children[0].files[0].raw
              );
              if (
                this.$refs.picture_card_after.$children[0].files[0].size /
                  1024 >
                1025
              ) {
                this.photoCompress(
                  this.$refs.picture_card_after.$children[0].files[0].raw,
                  { quality: 0.2 },
                  base64Codes => {
                    let _blob_r = convertBase64UrlToBlob(base64Codes);
                    formdata.append("recruit_simple", _blob_r);
                    resolve(formdata);
                  }
                );
              } else {
                formdata.append(
                  "recruit_simple",
                  this.$refs.picture_card_after.$children[0].files[0].raw
                );
                resolve(formdata);
              }
            } else {
              resolve(formdata);
            }
          });

          Promise.all([promise1, promise2]).then(values => {
            this.submitData(formdata);
          });

          // if(this.$refs.picture_card_before.$children[0].files[0].size/1024 > 1025){
          //     //大于1M做压缩
          //     this.photoCompress(this.$refs.picture_card_before.$children[0].files[0].raw,{quality: 0.2},(base64Codes)=>{
          //         let _blob = convertBase64UrlToBlob(base64Codes);
          //         formdata.append("image_simple",_blob);
          //         if(this.$refs.picture_card_after.$children[0].files[0].size/1024 > 1025){
          //           this.photoCompress(this.$refs.picture_card_after.$children[0].files[0].raw,{quality: 0.2},(base64Codes)=>{
          //             let _blob_r = convertBase64UrlToBlob(base64Codes);
          //             formdata.append("recruit_simple",_blob_r);
          //             this.submitData(formdata);
          //           });
          //         }else{
          //           formdata.append("recruit_simple",this.$refs.picture_card_after.$children[0].files[0].raw);
          //           this.submitData(formdata);
          //         }
          //     });
          // }else{
          //   formdata.append("image_simple",this.$refs.picture_card_before.$children[0].files[0].raw);
          //   if(this.$refs.picture_card_after.$children[0].files[0].size/1024 > 1025){
          //     this.photoCompress(this.$refs.picture_card_after.$children[0].files[0].raw,{quality: 0.2},(base64Codes)=>{
          //       let _blob_r = convertBase64UrlToBlob(base64Codes);
          //       formdata.append("recruit_simple",_blob_r);
          //       this.submitData(formdata);
          //     });
          //   }else{
          //     formdata.append("recruit_simple",this.$refs.picture_card_after.$children[0].files[0].raw);
          //     this.submitData(formdata);
          //   }
          // }
        } else {
          this.$message({ type: "info", message: "信息请填写完整" });
        }
      });
    },
    submitData(fdata) {
      this.$request({
        url: "/rf/addSysSignageError",
        method: "post",
        data: fdata,
        headers: { "Content-Type": "multipart/form-data" }
      })
        .then(response => {
          if (response.error_code == 0) {
            this.loginLoading = false;
            this.dialogFormVisible = false;
            this.$message({ type: "success", message: "添加成功" });
            this.orderList(this.currentPage);
          } else {
            this.loginLoading = false;
            this.$message({ message: response.error_msg, type: "info" });
          }
        })
        .catch(error => {
          this.loginLoading = false;

          this.$message({
            message: "提交失败，网络异常",
            type: "info",
            duration: 2000
          });
        });
    },
    submitUpdateData(fdata) {
      this.$request({
        url: "/rf/updateSysSignageError",
        method: "post",
        data: fdata,
        headers: { "Content-Type": "multipart/form-data" }
      })
        .then(response => {
          if (response.error_code == 0) {
            this.updateLoginLoading = false;
            this.dialogFormVisibleUpdate = false;
            this.$message({ type: "success", message: "修改成功" });
            this.orderList(this.currentPage);
          } else {
            this.updateLoginLoading = false;
            this.$message({ message: response.error_msg, type: "info" });
          }
        })
        .catch(error => {
          this.updateLoginLoading = false;
          this.$message({
            message: "提交失败，网络异常",
            type: "info",
            duration: 2000
          });
        });
    },
    update() {
      this.$refs.formUpdate.validate(async valid => {
        if (valid) {
          this.updateLoginLoading = true;
          let formdata = new FormData();
          let {
            number,
            rectify_number,
            address,
            x,
            y,
            unit_name,
            name,
            phone,
            status,
            examine_date,
            hidden_danger_desc,
            review_date,
            review_result
          } = this.add_newShop;
          formdata.append("number", number);
          formdata.append("rectify_number", rectify_number);
          formdata.append("address", address);
          formdata.append("x", x);
          formdata.append("y", y);
          formdata.append("unit_name", unit_name);
          formdata.append("name", name);
          formdata.append("phone", phone);
          formdata.append("status", status);
          formdata.append("examine_date", examine_date);
          formdata.append("hidden_danger_desc", hidden_danger_desc);
          formdata.append("review_date", review_date);
          formdata.append("review_result", review_result);

          let promise1 = new Promise((resolve, reject) => {
            if (
              this.$refs.picture_card_before_update.$children[0].files[0] &&
              this.$refs.picture_card_before_update.$children[0].files[0].raw
            ) {
              formdata.append(
                "image",
                this.$refs.picture_card_before_update.$children[0].files[0].raw
              );
              if (
                this.$refs.picture_card_before_update.$children[0].files[0]
                  .size /
                  1024 >
                1025
              ) {
                this.photoCompress(
                  this.$refs.picture_card_before_update.$children[0].files[0]
                    .raw,
                  { quality: 0.2 },
                  base64Codes => {
                    let _blob = convertBase64UrlToBlob(base64Codes);
                    formdata.append("image_simple", _blob);
                    resolve(formdata);
                  }
                );
              } else {
                formdata.append(
                  "image_simple",
                  this.$refs.picture_card_before_update.$children[0].files[0]
                    .raw
                );
                resolve(formdata);
              }
            } else {
              resolve(formdata);
            }
          });

          let promise2 = new Promise((resolve, reject) => {
            if (
              this.$refs.picture_card_after_update.$children[0].files[0] &&
              this.$refs.picture_card_after_update.$children[0].files[0].raw
            ) {
              formdata.append(
                "recruit",
                this.$refs.picture_card_after_update.$children[0].files[0].raw
              );
              if (
                this.$refs.picture_card_after_update.$children[0].files[0]
                  .size /
                  1024 >
                1025
              ) {
                this.photoCompress(
                  this.$refs.picture_card_after_update.$children[0].files[0]
                    .raw,
                  { quality: 0.2 },
                  base64Codes => {
                    let _blob_r = convertBase64UrlToBlob(base64Codes);
                    formdata.append("recruit_simple", _blob_r);
                    resolve(formdata);
                  }
                );
              } else {
                formdata.append(
                  "recruit_simple",
                  this.$refs.picture_card_after_update.$children[0].files[0].raw
                );
                resolve(formdata);
              }
            } else {
              resolve(formdata);
            }
          });

          Promise.all([promise1, promise2]).then(values => {
            this.submitUpdateData(formdata);
          });

          // if(this.$refs.picture_card_before_update.$children[0].files[0].raw){
          //   formdata.append("image",this.$refs.picture_card_before_update.$children[0].files[0].raw);
          //   //大于1M做压缩
          //   if(this.$refs.picture_card_before_update.$children[0].files[0].size/1024 > 1025){
          //       this.photoCompress(this.$refs.picture_card_before.$children[0].files[0].raw,{quality: 0.2},(base64Codes)=>{
          //           let _blob = convertBase64UrlToBlob(base64Codes);
          //           formdata.append("image_simple",_blob);
          //           this.secondImageData(formdata);
          //       });
          //   }else{
          //     //小于1M直接传
          //     formdata.append("image_simple",this.$refs.picture_card_before.$children[0].files[0].raw);
          //     this.secondImageData(formdata);
          //   }
          // }else{
          //   this.secondImageData(formdata);
          // }
        } else {
          this.$message({ type: "info", message: "信息请填写完整" });
        }
      });
    },
    photoCompress(file, w, objDiv) {
      this.ready = new FileReader();
      this.ready.readAsDataURL(file);
      this.ready.onload = () => {
        let re = this.ready.result;
        canvasDataURL(re, w, objDiv);
      };
    },
    orderList(page) {
      let s = this.sousuo;
      this.shopTable = [];
      this.$request({
        url: "/rf/getSysSignageErrorListByType",
        method: "get",
        params: { page: page, address: s }
      })
        .then(response => {
          if (response.error_code == 0) {
            this.total = response.count;
            this.shopTable = response.data;
          } else {
            this.$message({ message: response.error_msg, type: "info" });
          }
        })
        .catch(error => {
          this.$message({
            message: "查询失败，网络异常",
            type: "info",
            duration: 2000
          });
        });
    },
    modify(row) {
      this.showMapUpdateContainer = true;
      this.dialogFormVisibleUpdate = true;
      this.dealFileListUpdate = [];
      this.dealFileListUpdate2 = [];
      this.dealFileListUpdate.push({
        name: "",
        url: row.imageurl + "?r=" + Math.random()
      });
      if (row.rectify_number) {
        this.dealFileListUpdate2.push({
          name: "",
          url: row.imageurl2 + "?r=" + Math.random()
        });
      }
      this.$nextTick(() => {
        this.add_newShop = { ...row };
        //console.log(this.$refs.picture_card_update.$children[0].files)
        this.showBtnDealImgUpdate =
          this.$refs.picture_card_before_update.$children[0].files.length >=
          this.limitCountImg;
        this.showBtnDealImgUpdate2 =
          this.$refs.picture_card_after_update.$children[0].files.length >=
          this.limitCountImg;
      });
    },
    delet(row) {
      this.$confirm("确定删除?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(async () => {
          this.$request({
            url: "/rf/deleteSysSignageError",
            method: "post",
            data: { number: row.number }
          })
            .then(response => {
              if (response.error_code == 0) {
                this.$message({ type: "success", message: "删除成功" });
                if (this.shopTable.length !== 1) {
                  this.orderList(this.currentPage);
                } else {
                  let cpage = this.currentPage - 1;
                  if (cpage > 0) {
                    this.orderList(cpage);
                  } else {
                    this.orderList(1);
                  }
                }
              } else {
                this.$message({ type: "success", message: response.error_msg });
              }
            })
            .catch(error => {
              this.$message({
                message: "删除失败，网络异常",
                type: "info",
                duration: 2000
              });
            });
        })
        .catch(() => {});
    },
    handler(id, px, py) {
      this.$nextTick(() => {
        var map = (this.map = new window.BMap.Map(id, {
          minZoom: 0
        }));
        var geoc = (this.geoc = new window.BMap.Geocoder());
        var point = new window.BMap.Point(121.492666, 31.220984);
        map.centerAndZoom(point, 15);
        map.setMinZoom(0);
        map.enableScrollWheelZoom(); //启用滚轮放大缩小
        map.enableKeyboard(); //启用键盘操作，默认禁用。键盘的上、下、左、右键可连续移动地图。
        map.enableContinuousZoom(); //启用连续缩放效果
        if (px && py) {
          var init_point = new window.BMap.Point(px, py);
          var init_marker = new window.BMap.Marker(init_point);
          map.addOverlay(init_marker);
          init_marker.enableDragging();
          init_marker.addEventListener("dragend", e => {
            this.add_newShop.x = e.point.lng;
            this.add_newShop.y = e.point.lat;
          });
        }

        map.addEventListener("click", e => {
          map.clearOverlays();
          //console.log('换位置百度的经度:'+e.point.lng+' , 纬度: '+e.point.lat);
          var point = new window.BMap.Point(e.point.lng, e.point.lat);
          var marker = new window.BMap.Marker(point);
          map.addOverlay(marker);
          marker.enableDragging();
          this.add_newShop.x = e.point.lng;
          this.add_newShop.y = e.point.lat;

          marker.addEventListener("dragend", e => {
            //console.log('换位置百度的经度:'+e.point.lng+' , 纬度: '+e.point.lat);
            this.add_newShop.x = e.point.lng;
            this.add_newShop.y = e.point.lat;
          });
        });
      });
    },
    searchLocation() {
      this.geoc.getPoint(
        this.add_newShop.address,
        point => {
          if (point) {
            this.map.clearOverlays();
            var search_point = new window.BMap.Point(point.lng, point.lat);
            var search_marker = new window.BMap.Marker(search_point);
            this.map.addOverlay(search_marker);
            this.map.centerAndZoom(search_point, 18);
            search_marker.enableDragging();
            this.add_newShop.x = point.lng;
            this.add_newShop.y = point.lat;
            search_marker.addEventListener("dragend", e => {
              this.add_newShop.x = e.point.lng;
              this.add_newShop.y = e.point.lat;
            });
          }
        },
        "上海市黄浦区"
      );
    }
  }
};
</script>

<style lang="less" scoped>
.el-card__body {
  .control-box {
    display: flex;
    justify-content: space-between;
    .add-shop {
      width: 92px;
      height: 32px;
      border: 1px solid #a6e8fb;
      box-shadow: 0px 0px 1px 0px #2baaeb;
      border-radius: 6px;
      display: flex;
      justify-content: center;
      align-items: center;
    }
    /deep/.el-button {
      span {
        font-size: 20px;
        font-family: Microsoft YaHei;
      }
    }
    /deep/.add-form {
      .el-dialog {
        margin-right: 460px;
        &.dialogImage {
          margin-right: 340px;
          .el-dialog__body {
            padding-top: 30px;
            padding-left: 16px;
            padding-right: 16px;
            padding-bottom: 30px;
          }
        }
        .el-dialog__header {
          .el-dialog__title {
            font-size: 26px;
            font-family: Microsoft YaHei;
            font-weight: bold;
            color: #202020;
          }
        }
        .el-dialog__body {
          // height:400px;
          // overflow-y: scroll;
          padding-top: 50px;
          padding-left: 16px;
          padding-right: 16px;
          padding-bottom: 24px;
          .el-form {
            .el-form-item {
              .el-form-item__label {
                font-size: 20px;
                font-family: Microsoft YaHei;
                font-weight: 400;
                color: #3a4262;
              }
              .el-form-item__content {
                .el-input {
                  width: 350px;
                  height: 36px;
                  background: #fafcfd;
                }
              }
            }
            .upload-form-item {
              .el-form-item__content {
                .image-upload {
                  display: inline-block;
                  margin-right: 15px;
                }
                // .uoloadSty .el-upload--picture-card{
                //   width:110px;
                //   height:110px;
                //   line-height:110px;
                //   display: inline-block;
                //   margin-right:15px;
                // }
                .inline {
                  display: inline-block;
                  margin-right: 15px;
                }
                .hide .el-upload--picture-card {
                  display: none; /* 上传按钮隐藏 */
                }
                .hide2 .el-upload--picture-card {
                  display: none; /* 上传按钮隐藏 */
                }
              }
            }
          }
        }
      }
    }
    /deep/.calendar {
      .el-dialog {
        //margin-right: 100px;
        .el-dialog__header {
          .el-dialog__title {
            font-size: 26px;
            font-family: Microsoft YaHei;
            font-weight: bold;
            color: #202020;
            line-height: 26px;
          }
        }
        .el-dialog__body {
          display: flex;
          justify-content: space-between;
          .el-calendar {
            width: 826px;
            .el-calendar-table {
              .is-today {
                p {
                  color: #394262;
                  background-color: #77c0fd;
                  border-radius: 50%;
                }
              }
              .is-checked {
                color: #394262;
                background-color: #ff0;
                border-radius: 50%;
              }
              .el-calendar-day {
                height: 80px;
                display: flex;
                justify-content: center;
                align-items: center;
                p {
                  height: 56px;
                  width: 56px;
                  font-size: 24px;
                  text-align: center;
                  line-height: 56px;
                }
              }
            }
            .el-calendar__header {
              .el-calendar__title {
                font-size: 30px;
                font-family: Microsoft YaHei;
                font-weight: 400;
                color: #394262;
                line-height: 26px;
              }
            }
          }
          .el-form {
            // width:400px;
            margin-right: 0px;
            padding-right: 0px;
            .el-form-item {
              .el-form-item__label {
                font-size: 20px;
                font-family: Microsoft YaHei;
                font-weight: 400;
                color: #394262;
                line-height: 26px;
              }
              .el-form-item__content {
                .el-input {
                  width: 350px;
                }
              }
            }
            .textarea {
              .el-textarea__inner {
                height: 400px;
              }
            }
          }
        }
      }
    }
  }
  .shop_list_table {
    margin-top: 17px;
  }
  .el-pagination {
    margin-top: 10px;
    margin-bottom: 10px;
  }
  .el-button {
    font-size: 16px;
  }
}
.bm-view {
  width: 100%;
  height: 300px;
}
</style>
